<template>
	<view class="v-home-page" :style="{ '--bg-image': `url(${ materialBg})` }">
		<view :style="{ height: navTop + 'px' }"></view>
		<view id="barTitle" :style="{ opacity: opacityStyle, height: heightSystemss+Number(70) + 'px' }"
			v-show="!hiddenModel">
			<text>打造多镜头</text>
		</view>
		<view class="flex-start-center " style="color:#333333" @click="navBack()">

			<uni-icons style="margin-top: 7rpx;" color="#333333" type="left" size="20"></uni-icons>
			<text style="color: 333333;font-size: 33rpx;"> 老板IP打造多镜头</text>
		</view>

		<view class="list-public">
			<view class="margin-bottom_20rpx font-weight_bold">
				任务标题
				<span class="red-dot">*</span>
			</view>

			<view class="display-a input-name" style="width: 650rpx;">
				<view class="bgInput flex-start-center">
					<input type="text" v-model="form.name" placeholder="请自定义输入一个任务名称" />
				</view>

				<!-- <image class="matrix-20" :src="matrix20"></image> -->
			</view>

			<view class="font-weight_bold" style="margin: 40rpx 0 20rpx 0;">
				选择素材
				<span class="red-dot">*</span>
			</view>



			<view class="" v-for="(item,index) in multiLensList" :key="index">



				<view class="margin_20rpx_0">
					镜头{{ index + 1 }}
				</view>
				<view class=" font-overflow"
					style="font-size: 24rpx;color: rgba(153, 153, 153, 1);width: 650rpx;margin-bottom: 20rpx;"
					v-if="item.describes">
					描述：{{item.describes}}
				</view>

				<view class="display-a input-name" style="width: 650rpx;" @click="selSolder(index,2)">

					<view class="bgInput flex-start-center">
						<input type="text" v-model="item.name" disabled placeholder="请选择你的视频素材" />
					</view>

					<image class="matrix-20" :src="matrix20"></image>
				</view>

			</view>


		</view>

		<view class="list-public">
			<view class="font-weight_bold" style="margin: 0rpx 0 20rpx 0;">
				文案已提取
				<span class="red-dot">*</span>
			</view>
			<view class="textarea-box ">
				<textarea placeholder-style="font-size:30rpx;" v-model="form.content" placeholder="复制短视频抖音主页账号地址链接"
					maxlength="500" @input="descInput" style="height: 100%;background-color: #F6F8FF;" />
			</view>

			<view class="flex-between-start">


				<view class="margin-top_30rpx AiDubbing flex-column margin-right_30rpx" @click="aiDubbing()"
					v-if="isEmptyAiDubbingObj">
					<image class="aiDubbingImg margin-bottom_20rpx" :src="group3184" mode=""></image>
					<text>AI配音</text>

				</view>
			</view>


		</view>


		<view class="" v-if="!isEmptyAiDubbingObj&&(form.audio_type==1||form.audio_type==0)">
			<view class="font-weight_bold margin_25rpx_0" style="font-size: 34rpx;">
				ai配音
			</view>
			<view class="backgroundMusic flex-between ">
				<view class="flex-align-center">
					<view class="" @click="trialListenings(aiDubbingObj.voiceUrl)">
						<image v-if="isPlay==1" class="musicImg" :src="group3199" mode=""></image>
						<image v-else class="musicImg" :src="group3198" mode=""></image>


					</view>

					<view class="flex-columns margin-left_16rpx">
						<view class="r-name">{{ aiDubbingObj.voiceName }}</view>
						<!-- <view class="r-date">{{item.second}}|{{ item.createTime }}</view> -->

						<view class="r-date">{{(aiDubbingObj.duration?aiDubbingObj.duration:0).toFixed(2)}}秒 |
							{{ aiDubbingObj.voiceType?aiDubbingObj.voiceType :'无' }}
						</view>
					</view>
				</view>

				<view class="changeMusic flex" @click="aiDubbing()">
					<image class="musicImg" :src="group3360Sever" mode=""></image>
					<text>更换配音</text>
				</view>

				<!-- <view class="flex-align-center try-listening-cls" >
					<iamge></iamge>
					<view style="color: #fff;">试听</view>
				</view> -->
			</view>
		</view>
		<view class="" v-if="form.audio_type==2">
			<view class="font-weight_bold margin_25rpx_0" style="font-size: 34rpx;">
				我的音色
			</view>
			<view class="backgroundMusic flex-between ">
				<view class="flex-align-center">
					<view class="" @click="trialListeningsTimbre(aiTimbreObj.voiceUrl)">
						<image v-if="isPlayTimbre==1" class="musicImg" :src="group3199" mode=""></image>
						<image v-else class="musicImg" :src="group3198" mode=""></image>


					</view>

					<view class="flex-columns margin-left_16rpx">
						<view class="r-name">{{ aiTimbreObj.name }}</view>
						<!-- <view class="r-date">{{item.second}}|{{ item.createTime }}</view> -->

						<view class="r-date" v-if="aiTimbreObj.duration">

							{{(aiTimbreObj.duration?aiTimbreObj.duration:0).toFixed(2)}}秒

						</view>
					</view>
				</view>

				<view class="changeMusic flex" @click="aiDubbing()">
					<image class="musicImg" :src="group3360Sever" mode=""></image>
					<text>更换配音</text>
				</view>

				<!-- <view class="flex-align-center try-listening-cls" >
							<iamge></iamge>
							<view style="color: #fff;">试听</view>
						</view> -->
			</view>
		</view>

		<view class="c-but flex" @click="but()">确定</view>
		<view class="" style="height: 200rpx;">

		</view>



		<sunui-popup ref="videoNum">
			<template v-slot:content>

				<view class="serviceItemsContain ">
					<view class="top flex-between">
						<view class="">

						</view>
						<text>视频数量</text>
						<uni-icons @click='closeVideoNum()' class="uniIcon" type="closeempty" size="22"
							style="color: #07070791;">
						</uni-icons>
					</view>
					<view class="flex-between margin-top_30rpx">
						<text class="font-weight_bold">当前算力{{user.balance}}</text>
						<view class="" @click="czGo()" v-if="memberSetObj.is_open==1">

							<text style="color: 333333;font-size: 33rpx;color: #6475FF;"> 去充值</text>
							<uni-icons style="margin-top: 7rpx;" color="#6475FF" type="right" size="17"></uni-icons>
						</view>
					</view>

					<view class="card margin-bottom_50rpx">
						<view class="myNmae">

							<view class="">
								<input class="uni-inputsa" @input="keyWorderInput(video_count)" type="number"
									v-model="video_count" placeholder="请输入视频数量" />
							</view>


						</view>

					</view>

					<view class="font-size_26rpx padding-bottom_40rpx">
						提示：建议最大生成{{videoNum}}个视频 (不可超过当前最大数量)
					</view>

					<view class="PublishTags flex" @click="videoNumBtn()">
						提交任务 {{'('+"算力："+(tallySetTemplate_tally).toFixed(2)+')'}}
					</view>

				</view>

			</template>
		</sunui-popup>


	</view>
</template>

<script>
	const innerAudioContext1 = uni.createInnerAudioContext();
	const innerAudioContext2 = uni.createInnerAudioContext();
	export default {
		data() {
			return {
				user: uni.getStorageSync('user'),
				navTop: '',
				materialBg: 'https://tuanma.weijuyunke.com/index/images/material.png',
				matrix20: 'https://yuntt.weijuyunke.com/yunttXcxImage/matrix/20.png',
				group3186: this.$imgs.group3186,
				group3198: this.$imgs.group3198,
				group3199: this.$imgs.group3199,
				group3184: this.$imgs.group3184,
				group3360Sever: this.$imgs.group3360Sever,
				tallySet: uni.getStorageSync('tallySet'),
				solderTitle: '',
				obj: '',
				video_count: '',
				tallySetTemplate_tally: 0,
				id: '',
				obj: '',
				isPlay: 2,
				// name 
				form: {
					// 1.老板IP单镜头 2.老板IP多镜头 3.口播同步
					type: '2',
					dub: '',

					name: '',
					// 模板配置
					config: {},
					// 当前模板配置


					name: '',
					content: "",
					resource_folder_id: '',

					lens_str: [],
					dub_url: '',
					dub_voice: '',
					bgm_url: '',
					bgm_id: '',
					dub_value: '',
					audio_type:0,
					sound_id:'',
					voice_id:''

				},
				multiLensList: [],
				aiDubbingObj: {},
				videoNum: '',
				previewUrl: '',
				copyTypeInfo: {},
				hiddenModel: true, //显示影藏
				opacityStyle: 0, //透明度
				heightSystemss: "",
				count: 0,
				intervalId: '',
				memberSetObj: {},
				aiTimbreObj: {},
				isPlayTimbre: 2,
				demoDub_url: false,
				testContent: ['秋天的公园里，落叶铺满了小路，踏上去有种说不出的舒爽，偶然间抬头，那抹深秋的蓝天格外高远、明净。'],

				totNum: 0,
					stMusicUrl: '',



			}
		},
		onLoad(options) {
			const app = getApp();
			this.navTop = app.globalData.navTop;
			this.createdgetSystemInfo()
			this.userInfos()
			this.memberSetFn()
			this.tallySetFn()






			if (options.obj) {
				this.obj = JSON.parse(decodeURIComponent(options.obj));
				this.form.config = this.obj
				this.form.content = this.obj.videoCopywriting

				if (this.obj.way == 2) {
					this.multiLensList = this.obj.lensList.map((item) => {
						return {
							name: "",
							id: item.id ? item.id : '',
							describes: item.describes
						}
					})
				} else {
					this.multiLensList = this.obj.multilensList.map((item) => {
						return {
							name: item.name ? item.name : "",
							id: item.id ? item.id : '',
							describes: item.describes
						}
					})
				}
				console.log(this.multiLensList)

			} else {
				this.copyTypeInfo = JSON.parse((decodeURIComponent(options.objs)));

				this.id = this.copyTypeInfo.id
				this.$sun.assignObject(this.form, {
					...this.copyTypeInfo
				})

				this.form.video_count = 0
				if (!this.form.dub) {
					this.aiDubbingObj = {}
				} else {
					this.aiDubbingObj.voiceUrl = this.form.dub_url;
					this.aiDubbingObj.voiceName = this.form.dub_voice;

					innerAudioContext1.src = this.aiDubbingObj.voiceUrl;

					this.$nextTick(() => {
						setTimeout(() => {
							console.log(innerAudioContext1.duration)
							this.$set(this.aiDubbingObj, 'duration', innerAudioContext1.duration);
						}, 500)
					})

				}
				if (this.form.audio_type == 2) {
					if (this.form.dub_url) {
						this.$set(this.aiTimbreObj, 'voiceUrl', this.form.dub_url);
					}
					if (this.form.dub_voice) {
						this.$set(this.aiTimbreObj, 'name', this.form.dub_voice);
					}
				
				
				
					this.$nextTick(() => {
						innerAudioContext1.src = this.form.dub_url;
						setTimeout(() => {
							if (this.form.dub_url) {
				
								console.log(innerAudioContext1.duration)
								this.$set(this.aiTimbreObj, 'duration', innerAudioContext1.duration);
							}
				
						}, 1500)
					})
				
					console.log(this.aiTimbreObj)
				
				}
				this.form.config = this.copyTypeInfo.config
				this.multiLensList = JSON.parse(JSON.stringify(this.form.lens_str))


				if (this.form.config.way == 2) {
					this.multiLensList.forEach((item, index) => {
						this.multiLensList[index].describes = this.form.config.lensList[index].describes
					})
				} else {
					this.multiLensList.forEach((item, index) => {
						this.multiLensList[index].describes = this.form.config.multilensList[index].describes
					})
				}

				this.folderPageFn(this.multiLensList)


				if (this.video_count) {
					this.tallySetTemplate_tally = Number(this.tallySet.template_tally) * Number(this.video_count)
				} else {
					this.tallySetTemplate_tally = Number(this.tallySet.template_tally)
				}





				console.log(this.multiLensList)




				console.log(this.form, 'this。form')

			}


		},
		computed: {
			isEmptyAiDubbingObj() {
				return Object.keys(this.aiDubbingObj).length === 0;
			}


		},
		onUnload() {
			console.log('页面隐藏');
			// 在这里执行需要的操作
			this.isPlay = 1;


             this.isPlayTimbre = 1
			this.trialListenings(this.aiDubbingObj.voiceUrl)

			if (this.demoDub_url) {
				this.trialListeningsTimbre(this.demoDub_url);
			} else {
				setTimeout(() => {
					this.isPlayTimbre = 2
				}, 500)
			}


		},

		onHide() {
			// 页面隐藏时调用
			console.log('页面隐藏');
			// 在这里执行需要的操作
			this.isPlay = 1;


			//播放音频
			this.trialListenings(this.aiDubbingObj.voiceUrl)
              this.isPlayTimbre = 1
			if (this.demoDub_url) {
				this.trialListeningsTimbre(this.demoDub_url);
			} else {
				setTimeout(() => {
					this.isPlayTimbre = 2
				}, 500)
			}

		},
		onPageScroll(ev) {


			if (ev.scrollTop > 10) {
				let opacity = ev.scrollTop / 140

				// this.opacityStyle = opacity > 1 ? 1 : opacity
				this.opacityStyle = 1
				this.hiddenModel = false
				// this.createdgetSystemInfo();

			} else {
				this.hiddenModel = true
			}
		},
		methods: {
			async soundSaveFn() {
				let totalDeduction = ((this.testContent[0].length / 100) * this.tallySet.sound_tally).toFixed(2);
				if (totalDeduction < 100) {
					totalDeduction = this.tallySet.sound_tally; // 如果次数小于100，直接扣50点
				}

				if (Number(this.user.balance) <= Number(totalDeduction)) {
					this.$sun.toast('每一百字扣 ' + this.tallySet.sound_tally + '算力,当前算力不足无法提交', 'none')
					return
				}
				uni.showLoading({
					title: '加载中...',
					mask: true
				});
				const result = await this.$http.post({
					url: this.$api.soundSave,
					data: {
						uid: uni.getStorageSync('uid'),
						type: 4,
						task_id: this.id,
						voice_id: this.form.voice_id,
						msg: this.testContent[0]
					}
				});

				if (result.errno == 0) {
					console.log(this.form.voice_id, result.data)
					uni.hideLoading()
					this.voiceSetDemoFn(this.form.voice_id, result.data)


				} else {
					setTimeout(() => {
						this.$sun.toast(result.message, 'none');
					}, 500)
					uni.hideLoading()
				}
			},
			async voiceSetDemoFn(voice_id, sound_id) {
				const result = await this.$http.post({
					url: this.$api.voiceSetDemo,
					data: {
						uid: uni.getStorageSync('uid'),
			
						voice_id: voice_id,
						sound_id: sound_id
					}
				});
				if (result.errno == 0) {
					console.log(result.data)
			
					this.stMusicUrl = result.data
					innerAudioContext2.src = result.data;
					console.log(innerAudioContext2)
					this.$forceUpdate()
					if (this.isPlayTimbre == 2) {
						this.isPlayTimbre = 1;
						innerAudioContext2.play();
						innerAudioContext2.onPlay(() => {
							console.log('开始播放');
						});
						innerAudioContext2.onEnded(() => {
							this.isPlayTimbre = 2;
			
							innerAudioContext2.pause();
							// this.$sun.toast("音频播放完成");
							console.log('音频播放结束：');
						});
						innerAudioContext2.onError(err => {
							innerAudioContext2.destroy();
							console.log('播放音频出错：', err);
						});
					} else {
						this.isPlayTimbre = 2;
						innerAudioContext2.pause();
						innerAudioContext2.onPause(() => {
							console.log('暂停播放');
						});
						console.log('暂停播放');
					}
			
			
			
				} else {
					this.$sun.toast(result.message, 'none');
				}
			},
			trialListeningsTimbre(url) {



				if (!this.demoDub_url) {
					this.soundSaveFn()
				} else {


					innerAudioContext2.src = this.form.dub_url
					console.log(innerAudioContext2)



					// this.$forceUpdate()
					if (this.isPlayTimbre == 2) {
						this.isPlayTimbre = 1;
						innerAudioContext2.play();
						innerAudioContext2.onCanplay(() => {
							console.log('开始播放');
						});
						innerAudioContext2.onEnded(() => {
							this.isPlayTimbre = 2;

							innerAudioContext2.pause();
							// this.$sun.toast("音频播放完成");
							console.log('音频播放结束：');
						});
						innerAudioContext2.onError(err => {
							innerAudioContext2.destroy();
							console.log('播放音频出错：', err);
						});



					} else {
						this.isPlayTimbre = 2;

						innerAudioContext2.pause();
						innerAudioContext2.onPause(() => {
							console.log('暂停播放');
						});

					}
				}

			},
			keyWorderInput(e) {

				if (e) {
					this.tallySetTemplate_tally = Number(this.tallySet.template_tally) * Number(e)
				} else {
					this.tallySetTemplate_tally = Number(this.tallySet.template_tally)
				}

			},
			async tallySetFn() {
				const result = await this.$http.get({
					url: this.$api.tallySet,

				});
				if (result.errno == 0) {
					console.log(result.data)

					uni.setStorageSync('tallySet', result.data);



				} else {
					this.$sun.toast(result.message, 'none')
				}
			},
			async memberSetFn() {
				const result = await this.$http.get({
					url: this.$api.memberSet,
					data: {


					}
				});
				if (result.errno == 0) {

					this.memberSetObj = result.data

					console.log(result.data)

				}
			},
			czGo() {
				this.$sun.navGo('/pages/contactUs/memberCenter')

			},
			async userInfos() {
				const result = await this.$http.get({
					url: this.$api.userInfo,
					data: {
						// 用户id
						uid: uni.getStorageSync('uid'),
						// 上级id
						// pid: ''
					}
				});
				if (result.errno == 0) {
					this.user = result.data;

					uni.setStorageSync('user', result.data);


				}
			},
			createdgetSystemInfo() {
				let menuButtonObject = uni.getMenuButtonBoundingClientRect(); //获取菜单按钮（右上角胶囊按钮）的布局位置信息。坐标信息以屏幕左上角为原点。
				uni.getSystemInfo({
					//获取系统信息
					success: res => {
						let navHeight = menuButtonObject.height + (menuButtonObject.top - res
							.statusBarHeight) * 2; //导航栏高度=菜单按钮高度+（菜单按钮与顶部距离-状态栏高度）*2
						this.heightSystemss = navHeight;
						console.log(navHeight, '==========================')

					},
					fail(err) {
						console.log(err);
					}
				});
			},
			async folderPageFn(list) {
				// 查询 文件名字
				const result = await this.$http.post({
					url: this.$api.folderPage,
					data: {
						uid: uni.getStorageSync('uid'),
						type: 1,
						page: 1,
						psize: 30,

					}

				});
				if (result.errno == 0) {
					console.log(result.data)

					this.multiLensList.forEach((item, index) => {

						let res = result.data.list.find(item1 => item.folder_id == item1.id)
						console.log(res)
						if (res) {
							this.multiLensList[index].name = res.name

							// result.data.list.forEach((item, indexs) => {
							// 	this.multiLensList[indexs].name = result.data.list[indexs].name
							// })

						} else {
							this.multiLensList[index] = [{
								id: '',
								name: '',
								file_id: ''
							}]
							this.form.lens_str[index] = {
								folder_id: '',
								name: '',
								file_id: undefined
							}
						}



						this.multiLensList[index].title = this.form.lens_str[index].name

					})
					console.log(this.multiLensList)








				} else {

					this.$sun.toast(result.message)
				}
			},

			aiDubbing() {
				this.$sun.navGo('/pagesA/creatCenter/piecemeal/AiDubbing')
			},
			trialListenings(url) {
				this.previewUrl = url
				console.log(url)
				innerAudioContext2.src = this.previewUrl;
				console.log(innerAudioContext2)
				this.$forceUpdate()
				if (this.isPlay == 2) {
					this.isPlay = 1;
					innerAudioContext2.play();
					innerAudioContext2.onPlay(() => {
						console.log('开始播放');
					});
					innerAudioContext2.onEnded(() => {
						this.isPlay = 2;

						innerAudioContext2.pause();
						// this.$sun.toast("音频播放完成");
						console.log('音频播放结束：');
					});
					innerAudioContext2.onError(err => {
						innerAudioContext2.destroy();
						console.log('播放音频出错：', err);
					});
				} else {
					this.isPlay = 2;
					innerAudioContext2.pause();
					innerAudioContext2.onPause(() => {
						console.log('暂停播放');
					});
					console.log('暂停播放');
				}
			},
			changeMusicFn() {
				this.$sun.navGo('/pagesA/creatCenter/piecemeal/AiDubbing')
			},
			aiDubbingFuns(item) {
				this.aiDubbingObj = JSON.parse(item).aiDubbingObj
				console.log(this.aiDubbingObj)

				this.form.dub_url = this.aiDubbingObj.voiceUrl;
				this.form.dub_voice = this.aiDubbingObj.voiceName;

				this.form.dub_value = this.aiDubbingObj.voice;
	             this.form.audio_type = this.aiDubbingObj.audio_type;

				innerAudioContext2.src = this.aiDubbingObj.voiceUrl;
				this.$nextTick(() => {
					setTimeout(() => {
						console.log(innerAudioContext2.duration)
						this.$set(this.aiDubbingObj, 'duration', innerAudioContext2.duration);
					}, 500)
				})
				// this.trialListening()



			},
			aiTimbreFuns(item) {
				this.aiTimbreObj = JSON.parse(item).aiTimbreObj
				console.log(this.aiTimbreObj, '=========================')

				this.form.voice_id = this.aiTimbreObj.id



				// 1是多镜头 单尽头 数字人   2. 食族人

				this.form.audio_type = this.aiTimbreObj.audio_type

				if (this.aiTimbreObj.demo) {
					this.form.dub_url = this.aiTimbreObj.demo;
					this.demoDub_url = true;
					innerAudioContext2.src = this.aiTimbreObj.demo;
				} else {
					this.form.dub_url = this.aiTimbreObj.voice_urls[0];
					this.demoDub_url = false
					innerAudioContext2.src = this.aiTimbreObj.voice_urls[0];
				}
				this.form.dub_voice = this.aiTimbreObj.name;


				this.$nextTick(() => {
					setTimeout(() => {
						console.log(innerAudioContext2.duration)

						this.$set(this.aiTimbreObj, 'duration', innerAudioContext2.duration);
						this.aiTimbreObj.duration = innerAudioContext2.duration

					}, 600)
				})
			},
			async videoNumBtn() {
				if (!this.videoNum) {

					this.$sun.toast('正在获取最大剪辑视频视频', 'none')
					return
				}

				if (this.videoNum < this.video_count) {

					this.$sun.toast('已超当前生成最大数量', 'none')
					return
				}
				uni.showLoading({
					title: '任务提交中...',
					mask: true
				});
				const result = await this.$http.post({
					url: this.$api.templateSubmit,
					data: {

						...this.form,
						uid: uni.getStorageSync("uid"),
						video_count: this.video_count,
						id: this.id,
						is_submit: 1


					}
				});
				if (result.errno == 0) {
					console.log(result.data)
					uni.hideLoading()
					this.$sun.toast(result.message, 'none')

					setTimeout(() => {
						this.$sun.navTo('/pagesA/creatCenter/creativeList/creativeListDetail')
					}, 200)
				} else {
					uni.hideLoading()
					setTimeout(() => {
						this.$sun.toast(result.message, 'none')
					}, 200)
				}
			},
			otherFuns(groupArr) {
				console.log(groupArr)
				console.log(this.multiLensList)

				setTimeout(() => {
					this.multiLensList[JSON.parse(groupArr).selIndex].name = JSON.parse(groupArr).title
					this.multiLensList[JSON.parse(groupArr).selIndex].id = JSON.parse(groupArr).projectId
					this.multiLensList[JSON.parse(groupArr).selIndex].file_id = JSON.parse(groupArr).file_id

					console.log(this.multiLensList)
					this.multiLensList = this.multiLensList

					this.form.lens_str = this.multiLensList.map((item, index) => {
						return {
							folder_id: item.id,
							name: '镜头' + (Number(index) + 1),
							file_id: item.file_id
						}
					})
					this.form.resource_folder_id = ''
				}, 500)



			},
			navBack() {
				this.$sun.navBack()
			},
			closeVideoNum() {
				this.$refs.videoNum.close()
			},

			async trialListening() {

				if (!this.aiDubbingObj.voiceName) {
					this.$sun.toast('请选择ai配音', 'none')
					return
				}
				this.$refs.videoNum.show({
					anim: 'bottom',
					position: 'bottom',
					shadeClose: false, //false使用户不能点击其它关闭页面
					topclose: false,
					zIndex: 99999
				});
				const result = await this.$http.post({
					url: this.$api.aiComposite,
					data: {
						uid: uni.getStorageSync('uid'),
						voice: this.form.dub_value,
						content: [this.form.content],
						task_id: this.id,
						type: 4
					}

				});

				if (result.errno == 0) {
					console.log(result.data)
					this.form.dub = result.data




					this.startAction()


				} else {

					this.$sun.toast(result.message)
				}
			},
			async getVideoCountFnM() {
				const result = await this.$http.post({
					url: this.$api.getMuchFragmentCount,
					data: {
						uid: uni.getStorageSync("uid"),
						dub: this.form.dub,
						lens_str: this.form.lens_str,
						type: 2,
						audio_type: this.form.audio_type,
						sound_id: this.form.sound_id


					}
				});
				if (result.errno == 0) {
					console.log(result.data)
					if (result.data) {
						if (this.video_count) {
							this.tallySetTemplate_tally = Number(this.tallySet.template_tally) * Number(this
								.video_count)
						} else {
							this.tallySetTemplate_tally = Number(this.tallySet.template_tally)
						}
						this.videoNum = result.data
					} else {

					}
				} else {

					this.$sun.toast(result.message, 'none')
				}
			},

			startAction() {
				// 如果定时器已存在，先清除
				if (this.intervalId) {
					clearInterval(this.intervalId);
				}

				this.count = 0; // 重置计数
				this.intervalId = setInterval(() => {
					this.count++;
					this.getVideoCountFnM()

					// 当执行 3 次时，清除定时器
					if (this.count === 10 || this.videoNum) {
						clearInterval(this.intervalId);
						console.log('已执行 3 次操作，定时器停止');
					}
				}, 2000);
			},


			async but() {


				console.log(this.form)
				if (!this.form.name) {
					this.$sun.toast('请填写任务标题', 'none')
					return
				}


				if (this.form.lens_str.length < 2 || this.form.lens_str.length > 9) {
					this.$sun.toast('最低需添加2个镜头组，最多不超过8个镜头组、')
					return
				}
				if (!this.form.lens_str.length) {
					this.$sun.toast('请选择文件夹', 'none')
					return
				}
				const indexesWithoutFileId = this.form.lens_str
					.map((item, index) => item.file_id === undefined ? index + 1 : -1)
					.filter(index => index !== -1);



				if (indexesWithoutFileId.length) {
					this.$sun.toast('镜头组' + indexesWithoutFileId + '有问题请重新选择')
					return
				}

				if (this.id) {
					if (this.form.dub && this.form.audio_type != 2) {
						this.trialListening()
					} else {
						if (this.form.audio_type == 2) {
							if (!this.form.voice_id) {
								this.$sun.toast('请选择数字人音色', 'none')
							} else {


								let totalDeduction

								if (this.form.content.length < 100) {
									totalDeduction = this.tallySet.sound_tally; // 如果次数小于100，直接扣50点
								} else {
									totalDeduction = (Math.ceil(this.form.content.length / 100) * this.tallySet
										.sound_tally).toFixed(2);
								}

								if (Number(this.user.balance) <= Number(totalDeduction)) {
									this.$sun.toast('每一百字扣 ' + this.tallySet.sound_tally + '算力,当前算力不足无法提交', 'none')
									return
								}
								uni.showLoading({
									title: '提交任务中...',
									mask: true
								});

								console.log(this.form)
								const result = await this.$http.post({
									url: this.$api.soundSave,
									data: {
										uid: uni.getStorageSync("uid"),
										voice_id: this.form.voice_id,
										type: 4,
										task_id: this.id,
										msg: [this.form.content]
									}
								});
								if (result.errno == 0) {
									console.log(result.data)
									if (result.data) {
										this.form.sound_id = result.data
										uni.hideLoading()



										// this.isDisabled = true
										// this.form.title_open = false
										// this.form.title_value = ''
										// this.form.caption_open = false
										// this.form.caption_value = {}




									}
								} else {
									uni.hideLoading()
									this.$sun.toast(result.message, 'none')
								}
							}
						} else {
							if (!this.form.dub) {
								this.$sun.toast('请选择ai配音', 'none')
								return
							}
						}
						this.getVideoCountFnM()
						this.$refs.videoNum.show({
							anim: 'bottom',
							position: 'bottom',
							shadeClose: false, //false使用户不能点击其它关闭页面
							topclose: false,
							zIndex: 99999
						});
					}


				} else {
					
					if (!this.form.dub_url) {
						this.$sun.toast('请选择ai配音', 'none')
						return
					}

					const result = await this.$http.post({
						url: this.$api.templateSave,
						data: {

							...this.form,
							uid: uni.getStorageSync("uid"),


						}
					});
					if (result.errno == 0) {
						console.log(result.data)
						this.id = result.data.id
						if (!this.form.dub && this.form.audio_type != 2) {
							this.trialListening()
						} else {
							if (this.form.audio_type == 2) {
								if (!this.form.voice_id) {
									this.$sun.toast('请选择数字人音色', 'none')
								} else {

									let totalDeduction

									if (this.form.content.length < 100) {
										totalDeduction = this.tallySet.sound_tally; // 如果次数小于100，直接扣50点
									} else {
										totalDeduction = (Math.ceil(this.form.content.length / 100) * this.tallySet
											.sound_tally).toFixed(2);
									}

									if (Number(this.user.balance) <= Number(totalDeduction)) {
										this.$sun.toast('每一百字扣 ' + this.tallySet.sound_tally + '算力,当前算力不足无法提交', 'none')
										return
									}
									uni.showLoading({
										title: '提交任务中...',
										mask: true
									});

									console.log(this.form)
									const result = await this.$http.post({
										url: this.$api.soundSave,
										data: {
											uid: uni.getStorageSync("uid"),
											voice_id: this.form.voice_id,
											type: 4,
											task_id: this.id,
											msg: [this.form.content]
										}
									});
									if (result.errno == 0) {
										console.log(result.data)
										if (result.data) {
											this.form.sound_id = result.data
											uni.hideLoading()



											// this.isDisabled = true
											// this.form.title_open = false
											// this.form.title_value = ''
											// this.form.caption_open = false
											// this.form.caption_value = {}

											this.getVideoCountFnM()
											this.$refs.videoNum.show({
												anim: 'bottom',
												position: 'bottom',
												shadeClose: false, //false使用户不能点击其它关闭页面
												topclose: false,
												zIndex: 99999
											});




										}
									} else {
										uni.hideLoading()
										this.$sun.toast(result.message, 'none')
									}
								}
							} else {
								if (!this.form.dub) {
									this.$sun.toast('请选择ai配音', 'none')
									return
								}
							}
						}





					} else {
						this.$sun.toast(result.message, 'none')
					}
				}
			},
			selSolder(index, mode) {

				this.$sun.navGo('/pagesA/creatCenter/material/SelmaterialCenter', {
					index: index,
					type: 1,
					mode: mode
				})
			},

		}
	}
</script>

<style lang="less">
	.v-home-page {
		background-image: (var(--bg-image));
		background-repeat: no-repeat;
		background-size: cover;
		position: relative;
		height: 100vh;
		padding: 20rpx;

		#barTitle {
			position: fixed;
			width: 750rpx;
			top: 0;
			left: 0;
			background: #fff;
			color: #000000;
			text-align: center;
			font-weight: bold;
			z-index: 9999
		}

		#barTitle>text {
			position: absolute;
			left: 0;
			right: 0;
			bottom: 20rpx
		}

		.AiDubbing {

			width: 128rpx;
			height: 138.26rpx;
			border-radius: 12rpx;
			color: #7200FF;

			background: rgb(249, 248, 255);

			.aiDubbingImg {
				width: 45rpx;
				height: 45rpx;
			}
		}

		.r-date {
			margin-top: 20rpx;
			color: rgb(153, 153, 153);
			font-size: 26rpx;
		}

		.r-name {
			color: rgb(51, 51, 51);
			font-size: 32rpx;
			font-weight: 600;
		}

		.backgroundMusic {

			width: 699.98rpx;
			height: 152.84rpx;
			padding: 19rpx;
			box-sizing: border-box;
			border: 2rpx solid rgb(249, 249, 249);
			border-radius: 20rpx;

			background: rgb(255, 255, 255);

			.musicImg {
				width: 111.06rpx;
				height: 111.06rpx;
			}

			.downloadImg {
				width: 28rpx;
				height: 28rpx;
			}

			.changeMusic {
				border-radius: 20rpx;
				width: 187.06rpx;
				height: 84rpx;
				color: #fff;
				background: linear-gradient(82.59deg, rgb(100, 117, 255) 1.294%, rgb(116, 100, 255) 99.047%);

				.musicImg {
					width: 30rpx;
					height: 30rpx;
					margin-right: 8rpx;
				}
			}
		}




		.serviceItemsContain {
			padding: 0rpx 30rpx 30rpx 30rpx;
			background-color: #fff;

			height: auto;
			overflow-x: auto;

			.PublishTags {
				z-index: 99;
				margin-top: 10rpx;
				height: 102rpx;
				border-radius: 20rpx;
				color: #fff;


				bottom: 20rpx;
				background: rgb(120, 93, 246);
			}

			.myNmae {

				background-color: #fff;
				min-width: 50rpx;

				.avatar {
					width: 84rpx;
					height: 84rpx;
				}

				input {
					text-align: left;
				}

				.uni-input {

					height: 100rpx;
				}

				.uni-inputsa {
					width: 100%;
					height: 90rpx;
					border-radius: 20rpx;
					background: rgb(245, 245, 245);
					margin: 20rpx 0;
					padding: 0rpx 20rpx;
				}

				.uni-inputs {
					text-align: left !important;
				}

				.backgroundImg {

					height: 154rpx;


				}

			}





			.top {
				padding: 30rpx 0;
				width: 100%;

				text {
					color: rgb(0, 0, 0);
					font-size: 36rpx;
					font-weight: 400;
				}
			}

		}

		.c-but {

			font-weight: 700;

			padding: 20rpx 40rpx;

			// color: #ffffff;
			width: 90%;
			position: fixed;
			bottom: 40rpx;
			left: 3%;
			border: none;

			z-index: 999;


			border-radius: 20rpx;
			margin: 20rpx;
			text-align: center;
			font-size: 32rpx;
			height: 100rpx;
			margin-top: 30rpx;
			color: #ffffff;
			background: linear-gradient(90deg, #6475FF, #7464FF 100%);
		}

		.list-public {
			.textarea-box {
				// width: 630rpx;
				border-radius: 20rpx;
				background: #F6F8FF;
				padding: 24rpx;

				height: calc(100vh - 1120rpx);

				.textarea-color {
					color: #999;
				}
			}

			border-radius: 20rpx;
			padding: 30rpx;
			margin: 0;
			margin-top: 50rpx;

			.matrix-20 {
				width: 18rpx;
				height: 30rpx;
				margin-left: auto;
			}

			.input-name {
				width: 610rpx;
				padding-right: 20rpx;
				// border: 2rpx solid #d9d9d9;
				border-radius: 10rpx;
				background: rgb(246, 248, 255);

				.bgInput {
					padding-left: 25rpx;
					width: 674.14rpx;
					height: 83.84rpx;
					border-radius: 12rpx;
					// color: #999999;


				}
			}

			.myNmae {

				background-color: #fff;
				min-width: 50rpx;

				.avatar {
					width: 84rpx;
					height: 84rpx;
				}

				input {
					text-align: left;
				}

				.uni-input {

					height: 100rpx;
				}

				.uni-inputsa {
					width: 94%;
					height: 90rpx;
					border-radius: 20rpx;
					background: rgb(245, 245, 245);
					// margin: 20rpx 0;
					padding: 0rpx 20rpx;
				}

				.uni-inputs {
					text-align: left !important;
				}

				.backgroundImg {

					height: 154rpx;


				}

			}

			.red-dot {
				color: #ff0000;
				margin-left: 10rpx;
			}

			.multiLensList {
				// width: 688rpx;
				// height: 116rpx;
				padding: 20rpx 20rpx;
				border-radius: 20rpx;

				background: rgb(248, 248, 248);

				.icon {
					width: 35rpx;
					height: 35rpx;
				}
			}

			.multiLensImg {
				width: 45.84rpx;
				height: 50rpx;
			}
		}
	}
</style>